import { Component, Vue } from 'vue-property-decorator'
import { orderStatusMap } from '../utils/staticData'
import { deepClone, commonAction } from '@/utils/common'

// 1 我创建的列 2 待领取的列 3 待办的列 4 我参与的列 5 全部工单的列
const defaultCol = {
  1: [
    { label: '工单编号', prop: 'orderNo', show: true },
    { label: '创建时间', prop: 'createTime', show: true },
    { label: '创建人', prop: 'createUser', show: false },
    { label: '工单状态', prop: 'orderStatus', show: true, custom: true },
    { label: '工单类型', prop: 'orderCategory', show: true },
    { label: '当前节点', prop: 'activityName', show: true },
    { label: '当前处理人', prop: 'master', show: true },
    { label: '客户名称', prop: 'customerNameVO', show: true },
    { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    { label: '工单来源', prop: 'source', custom: true, show: false },
    { label: '更新时间', prop: 'updateTime', show: false },
    { label: '当前SLA', prop: 'currentSlaStatus', custom: true, show: true },
    { label: '整体SLA', prop: 'entireSlaStatus', custom: true, show: true }
  ],
  2: [
    { label: '工单编号', prop: 'orderNo', show: true },
    { label: '创建时间', prop: 'createTime', show: true },
    { label: '创建人', prop: 'createUser', show: true },
    { label: '工单状态', prop: 'orderStatus', custom: true, show: false },
    { label: '工单类型', prop: 'orderCategory', show: true },
    { label: '当前节点', prop: 'activityName', show: true },
    { label: '当前处理人', prop: 'master', show: false },
    { label: '工单来源', prop: 'source', custom: true, show: true },
    { label: '客户名称', prop: 'customerNameVO', show: true },
    { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    { label: '当前SLA', prop: 'currentSlaStatus', custom: true, show: true },
    { label: '整体SLA', prop: 'entireSlaStatus', custom: true, show: true }
  ],
  3: [
    { label: '工单编号', prop: 'orderNo', show: true },
    { label: '创建时间', prop: 'createTime', show: true },
    { label: '创建人', prop: 'createUser', show: true },
    { label: '工单状态', prop: 'orderStatus', custom: true, show: false },
    { label: '工单类型', prop: 'orderCategory', show: true },
    { label: '当前节点', prop: 'activityName', show: true },
    { label: '当前处理人', prop: 'master', show: false },
    { label: '工单来源', prop: 'source', custom: true, show: true },
    { label: '客户名称', prop: 'customerNameVO', show: true },
    { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    { label: '当前SLA', prop: 'currentSlaStatus', custom: true, show: true },
    { label: '整体SLA', prop: 'entireSlaStatus', custom: true, show: true }
  ],
  4: [
    { label: '工单编号', prop: 'orderNo', show: true },
    { label: '创建时间', prop: 'createTime', show: true },
    { label: '创建人', prop: 'createUser', show: true },
    { label: '工单状态', prop: 'orderStatus', custom: true, show: true },
    { label: '工单类型', prop: 'orderCategory', show: true },
    { label: '当前节点', prop: 'activityName', show: true },
    { label: '当前处理人', prop: 'master', show: true },
    { label: '客户名称', prop: 'customerNameVO', show: true },
    { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    { label: '工单来源', prop: 'source', custom: true, show: true },
    { label: '更新时间', prop: 'updateTime', show: false },
    { label: '当前SLA', prop: 'currentSlaStatus', custom: true, show: true },
    { label: '整体SLA', prop: 'entireSlaStatus', custom: true, show: true }
  ],
  5: [
    { label: '工单编号', prop: 'orderNo', show: true },
    { label: '创建时间', prop: 'createTime', show: true },
    { label: '创建人', prop: 'createUser', show: true },
    { label: '工单状态', prop: 'orderStatus', custom: true, show: true },
    { label: '工单类型', prop: 'orderCategory', show: true },
    { label: '当前节点', prop: 'activityName', show: true },
    { label: '当前处理人', prop: 'master', show: true },
    { label: '客户名称', prop: 'customerNameVO', show: true },
    { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    { label: '工单来源', prop: 'source', custom: true, show: true },
    { label: '更新时间', prop: 'updateTime', show: false },
    { label: '当前SLA', prop: 'currentSlaStatus', custom: true, show: true },
    { label: '整体SLA', prop: 'entireSlaStatus', custom: true, show: true }
  ]
}
@Component({
  name: 'workerOrder'
})
export default class WorkerOrder extends Vue {
  [x: string]: any
  public queueTableHeader: any[] = []
  public originColId: string = ''
  public customerTableHeader: any[] = []
  public columnType: number = 1
  public colMap = {
    orderNo: { label: '工单编号', prop: 'orderNo', show: true },
    createTime: { label: '创建时间', prop: 'createTime', show: true },
    createUser: { label: '创建人', prop: 'createUser', show: false },
    orderStatus: { label: '工单状态', prop: 'orderStatus', show: true, custom: true },
    orderCategory: { label: '工单类型', prop: 'orderCategory', show: true },
    activityName: { label: '当前节点', prop: 'activityName', show: true },
    master: { label: '当前处理人', prop: 'master', show: true },
    customerNameVO: { label: '客户名称', prop: 'customerNameVO', show: true },
    customerPhoneVO: { label: '客户手机号', prop: 'customerPhoneVO', show: false },
    contactPhoneVO: { label: '联系人手机号', prop: 'contactPhoneVO', show: false },
    source: { label: '工单来源', prop: 'source', custom: true, show: false },
    updateTime: { label: '更新时间', prop: 'updateTime', show: false },
    currentSlaStatus: { label: '当前SLA', prop: 'currentSlaStatus', show: true, custom: true },
    entireSlaStatus: { label: '整体SLA', prop: 'entireSlaStatus', show: true, custom: true }
  }

  private get orderStatusMap () {
    return orderStatusMap
  }

  public getColumn (columnType) {
    this.columnType = columnType
    commonAction({
      url: '/server-work/action/view/search',
      method: 'post',
      data: { columnType }
    }).then(res => {
      if (res.success) {
        if (!res.data) {
          this.queueTableHeader = defaultCol[columnType].filter(item => item.show)
          // 处理操作列
          const handlers: any[] = []
          if (columnType === 1) {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            handlers.push({ className: 'danger', name: '删除', handleFn: (scope: any) => this.handleDel(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers })
          } else if (columnType === 2) {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            handlers.push({ className: 'danger', name: '领取', handleFn: (scope: any) => this.handleReceive(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers })
          } else {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers })
          }
          const row = defaultCol[columnType].map(item => {
            return {
              businessId: item.prop,
              isShow: item.show ? 1 : 0
            }
          })
          commonAction({
            url: '/server-work/action/view/insert',
            method: 'post',
            data: { columnType, showRow: row }
          }).then(res1 => {
            if (res1.success) {
              this.customerTableHeader = [...defaultCol[columnType]]
            }
          })
        } else {
          const { showRow, id } = res.data
          this.originColId = id
          this.customerTableHeader = showRow.map(item => {
            return {
              prop: item.businessId,
              show: item.isShow === 1,
              label: this.colMap[item.businessId].label,
              custom: this.colMap[item.businessId].custom
            }
          })
          this.queueTableHeader = this.customerTableHeader.filter(item => item.show)
          // 处理操作列
          const handlers: any[] = []
          if (columnType === 1) {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers, fixed: 'right' })
          } else if (columnType === 2) {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            handlers.push({ className: 'danger', name: '领取', handleFn: (scope: any) => this.handleReceive(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers, fixed: 'right' })
          } else {
            handlers.push({ name: '查看', handleFn: (scope: any) => this.handleEdit(scope.row) })
            this.queueTableHeader.push({ label: '操作', width: 100, handlers, fixed: 'right' })
          }
        }
      }
    })
  }

  private sourceMap = {
    1: '移动端',
    2: 'WEB端',
    3: '接口创建'
  }
}
